<template>
  <div>
    <div class="head">
      <h3>检测计划</h3>
    </div>
    <el-row>
      <testing-planning :patId="patientId" :state="state" ></testing-planning>
    </el-row>
    <el-divider></el-divider>
    <div class="head">
      <h3>历史检测</h3>
    </div>
    <el-row class="adjustment">
      <div>
        查&nbsp;&nbsp;看&nbsp;&nbsp;类&nbsp;&nbsp;型：
        <el-radio v-model="type" @change="insight_resize" label="1"
          >趋势图</el-radio
        >
        <el-radio v-model="type" label="2">数据表</el-radio>
      </div>
      <div>
        <el-button type="primary" @click="query()" class="query"
          >查询</el-button
        >
      </div>
    </el-row>
    <el-row>
      <el-col>
        <h5>近一周测量6次</h5>
      </el-col>
    </el-row>
    <el-row class="row-spacing">
      <el-col>
        起&nbsp;&nbsp;止&nbsp;&nbsp;日&nbsp;&nbsp;期：
        <el-date-picker
          v-model="dataRange"
          value-format="yyyy-MM-dd"
          type="daterange"
          :picker-options="pickerOptions"
          range-separator="至"
          start-placeholder="开始日期"
          end-placeholder="结束日期"
          align="right"
        >
        </el-date-picker>
      </el-col>
    </el-row>
    <el-row class="row-spacing">
      <el-col>
        查看检测项：
        <el-select
          v-model="test_item_option_value"
          placeholder="请选择"
          @change="getFrequencies($event)"
        >
          <el-option
            v-for="item in items"
            :key="item.code"
            :label="item.name"
            :value="item.name"
          >
          </el-option>
        </el-select>

        <div style="display:inline-block" v-if="type == 1">
                <div class="frequency" v-if="test_item_frequency_value">
                <el-select
                  v-model="test_item_frequency_value"
                  placeholder="请选择"
                  @change="getItemRange($event)"
                >
                  <el-option
                    v-for="item in frequencies"
                    :key="item.code"
                    :label="item.name"
                    :value="item.name"
                  >
                  </el-option>
                </el-select>
                </div>

                <el-tag
                v-if="itemRange !== ''"
                effect="plain"
                v-html="itemRange"
                ></el-tag>
        </div>

      </el-col>
    </el-row>


    <el-row class="row-spacing">
      <el-col>
        <!-- echarts start -->
        <div v-if="type == 1" class="box">
          <!-- echart start -->
          <div id="trendline" style="width: 100%; min-height: 400px">
          </div>
          <!-- echart end -->
        </div>
        <!-- echarts end -->

        <!-- tables start -->
        <div v-else class="box" style="width: 100%; max-height: 400px;">
          <!-- table start -->
          <el-table
            v-if="test_item_option_value == '血压/BP'"
            border
            :data="bloodPressure"
            max-height="400"
            style="width: 100%"
          >
            <el-table-column fixed prop="testTime" label="日期" width="120">
              <template slot-scope="scope">
                {{ scope.row.testTime.split(" ")[0] }}
              </template>
            </el-table-column>
            <el-table-column label="收缩压">
              <template slot-scope="scope">
                <div :class="{ red: scope.row.systolicAbnormal != 0 }">
                  {{ scope.row.systolic }}
                </div>
              </template>
            </el-table-column>
            <el-table-column label="舒张压">
              <template slot-scope="scope">
                <div :class="{ red: scope.row.diastolicAbnormal != 0 }">
                  {{ scope.row.diastolic }}
                </div>
              </template>
            </el-table-column>
            <el-table-column label="脉率">
              <template slot-scope="scope">
                <div :class="{ red: scope.row.heartRateAbnormal != 0 }">
                  {{ scope.row.heartRate }}
                </div>
              </template>
            </el-table-column>
          </el-table>
          <!-- table end -->

          <!-- table start -->
          <el-table
            v-if="test_item_option_value == '血糖/Glu'"
            border
            :data="bloodSugar"
            max-height="400"
            style="width: 100%"
          >
            <el-table-column fixed label="日期" width="120">
              <template slot-scope="scope">
                {{ scope.row.testTime.split(" ")[0] }}
              </template>
            </el-table-column>
            <el-table-column label="空腹">
              <template slot-scope="scope">
                <div :class="{ red: scope.row.sugarValueAbnormal != 0 }">
                  {{ scope.row.choose == 1 ? scope.row.sugarValue : "" }}
                </div>
              </template>
            </el-table-column>
            <el-table-column label="早餐后">
              <template slot-scope="scope">
                <div :class="{ red: scope.row.sugarValueAbnormal != 0 }">
                  {{ scope.row.choose == 2 ? scope.row.sugarValue : "" }}
                </div>
              </template>
            </el-table-column>
            <el-table-column label="午餐前">
              <template slot-scope="scope">
                <div :class="{ red: scope.row.sugarValueAbnormal != 0 }">
                  {{ scope.row.choose == 3 ? scope.row.sugarValue : "" }}
                </div>
              </template>
            </el-table-column>
            <el-table-column label="午餐后">
              <template slot-scope="scope">
                <div :class="{ red: scope.row.sugarValueAbnormal != 0 }">
                  {{ scope.row.choose == 4 ? scope.row.sugarValue : "" }}
                </div>
              </template>
            </el-table-column>
            <el-table-column label="晚餐前">
              <template slot-scope="scope">
                {{ scope.row.choose == 5 ? scope.row.sugarValue : "" }}
              </template>
            </el-table-column>
            <el-table-column label="晚餐后">
              <template slot-scope="scope">
                <div :class="{ red: scope.row.sugarValueAbnormal != 0 }">
                  {{ scope.row.choose == 6 ? scope.row.sugarValue : "" }}
                </div>
              </template>
            </el-table-column>
            <el-table-column label="睡前">
              <template slot-scope="scope">
                <div :class="{ red: scope.row.sugarValueAbnormal != 0 }">
                  {{ scope.row.choose == 7 ? scope.row.sugarValue : "" }}
                </div>
              </template>
            </el-table-column>
          </el-table>
          <!-- table end -->

          <!-- table start -->
          <el-table
            v-if="test_item_option_value == '血脂/TC'"
            border
            :data="bloodFat"
            max-height="400"
            style="width: 100%"
          >
            <el-table-column fixed prop="testTime" label="日期" width="120">
              <template slot-scope="scope">
                {{ scope.row.testTime.split(" ")[0] }}
              </template>
            </el-table-column>
            <el-table-column label="总胆固醇">
              <template slot-scope="scope">
                <div :class="{ red: scope.row.totalCholesterolAbnorma != 0 }">
                  {{ scope.row.totalCholesterol }}
                </div>
              </template>
            </el-table-column>
            <el-table-column label="甘油三酯">
              <template slot-scope="scope">
                <div :class="{ red: scope.row.triglycerideAbnormal != 0 }">
                  {{ scope.row.triglyceride }}
                </div>
              </template>
            </el-table-column>
            <el-table-column label="高密度脂蛋白">
              <template slot-scope="scope">
                <div :class="{ red: scope.row.sugarValueAbnormal != 0 }">
                  {{ scope.row.totalCholesterol }}
                </div>
              </template>
            </el-table-column>
            <el-table-column label="低密度脂蛋白">
              <template slot-scope="scope">
                <div :class="{ red: scope.row.ldlAbnormal != 0 }">
                  {{ scope.row.ldl }}
                </div>
              </template>
            </el-table-column>
          </el-table>
          <!-- table end -->

          <!-- table start -->
          <el-table
            v-if="test_item_option_value == '血尿/UA'"
            border
            :data="bloodUrine"
            max-height="400"
            style="width: 100%"
          >
            <el-table-column fixed prop="testTime" label="日期" width="120">
              <template slot-scope="scope">
                {{ scope.row.testTime.split(" ")[0] }}
              </template>
            </el-table-column>
            <el-table-column label="血尿酸">
              <template slot-scope="scope">
                <div :class="{ red: scope.row.bloodUricAcidAbnormal != 0 }">
                  {{ scope.row.bloodUricAcid }}
                </div>
              </template>
            </el-table-column>
          </el-table>
          <!-- table end -->

          <!-- table start -->
          <el-table
            v-if="test_item_option_value == '心电/ECG'"
            border
            :data="electrocardio"
            max-height="400"
            style="width: 100%"
          >
            <el-table-column fixed prop="testTime" label="日期" width="120">
              <template slot-scope="scope">
                {{ scope.row.testTime.split(" ")[0] }}
              </template>
            </el-table-column>
            <el-table-column label="心率">
              <template slot-scope="scope">
                <div :class="{ red: scope.row.heartRateAbnormal != 0 }">
                  {{ scope.row.heartRate }}
                </div>
              </template>
            </el-table-column>
            <el-table-column label="心电结论">
              <template slot-scope="scope">
                <div :class="{ red: scope.row.heartRateAbnormal != 0 }">
                  {{ scope.row.result }}
                </div>
              </template>
            </el-table-column>
          </el-table>
          <!-- table end -->

          <!-- table start -->
          <el-table
            v-if="test_item_option_value == '血氧'"
            border
            :data="bloodOxygen"
            max-height="400"
            style="width: 100%"
          >
            <el-table-column fixed prop="testTime" label="日期" width="120">
              <template slot-scope="scope">
                {{ scope.row.testTime.split(" ")[0] }}
              </template>
            </el-table-column>
            <el-table-column label="血氧浓度">
              <template slot-scope="scope">
                <div :class="{ red: scope.row.oxygenAbnormal != 0 }">
                  {{ scope.row.oxygen }}
                </div>
              </template>
            </el-table-column>
          </el-table>
          <!-- table end -->

          <!-- table start -->
          <el-table
            v-if="test_item_option_value == '糖化血红蛋白'"
            border
            :data="glycosylatedHb"
            max-height="400"
            style="width: 100%"
          >
            <el-table-column fixed prop="testTime" label="日期" width="120">
              <template slot-scope="scope">
                {{ scope.row.testTime.split(" ")[0] }}
              </template>
            </el-table-column>
            <el-table-column label="糖化血红蛋白值">
              <template slot-scope="scope">
                <div :class="{ red: scope.row.ghbValueAbnormal != 0 }">
                  {{ scope.row.ghbValue }}
                </div>
              </template>
            </el-table-column>
          </el-table>
          <!-- table end -->

          <!-- table start -->
          <el-table
            v-if="test_item_option_value == '同型半胱氨酸'"
            border
            :data="homocySteine"
            max-height="400"
            style="width: 100%"
          >
            <el-table-column fixed prop="testTime" label="日期" width="120">
              <template slot-scope="scope">
                {{ scope.row.testTime.split(" ")[0] }}
              </template>
            </el-table-column>
            <el-table-column label="同型半胱氨酸值">
              <template slot-scope="scope">
                <div :class="{ red: scope.row.homocySteineAcidAbnormal != 0 }">
                  {{ scope.row.homocySteineAcid }}
                </div>
              </template>
            </el-table-column>
          </el-table>
          <!-- table end -->
        </div>
        <!-- tables end -->
      </el-col>
    </el-row>
    <!--  <el-row>
      <el-col>
        <ul class="Thestylediagram">
          <li v-for="(item, index) in thepicture" :key="index">
            <img
              :src="
                baseURL +
                  '/api-check/followYzyFileStorages/followYzyFileStorage/img?fileId=' +
                  item.fileId
              "
            />
          </li>
        </ul>
      </el-col>
    </el-row>-->
    <!--<div>
      <el-button type="primary" @click="thequeryimage()" class="query"
        >提取</el-button
      >
    </div>-->
    <div>
      <el-button type="primary" @click="thequeryimage()">获取心电图</el-button>
    </div>
    <el-row class="row-spacing">
    <div v-for="(item, index) in hospitals" :key="index">
      <el-collapse accordion>
        <!-- 模块 start -->
        <el-collapse-item class="collapse-item hospital-item">
          <template slot="title">
            <span style="font-size:16px;font-weight:bold"> {{ item.createTime }} </span
            ><span style="margin-left: 30%;font-size:16px;font-weight:bold">{{ item.username }}</span
            ><span style="margin-left: 45%;font-size:16px;font-weight:bold">{{ item.deptName }}</span>
          </template>
          <img
            :src="
              baseURL +
                '/api-check/followYzyFileStorages/followYzyFileStorage/img?fileId=' +
                item.fileId
            "
            alt=""
            class="el-upload-list__item-thumbnail"
          />

          <!-- 图片区 start -->

          <!-- <div class="source">
            <div>
              <ul class="el-upload-list el-upload-list--picture-card">
                <li
                  class="el-upload-list__item"
                  v-for="(item, index) in thepicture"
                  :key="index"
                >
                  <img
                    :src="
                      baseURL +
                        '/api-check/followYzyFileStorages/followYzyFileStorage/img?fileId=' +
                        item.fileId
                    "
                    alt=""
                    class="el-upload-list__item-thumbnail"
                  />
                  <span class="el-upload-list__item-actions">
                    <span
                      class="el-upload-list__item-preview"
                      @click="
                        module_preview(
                          baseURL +
                            '/api-check/followYzyFileStorages/followYzyFileStorage/img?fileId=' +
                            item.fileId
                        )
                      "
                    >
                      <i class="el-icon-zoom-in"></i>
                    </span>
                  </span>
                </li>
              </ul>
            </div>
          </div>-->

          <!-- 图片区 end -->
        </el-collapse-item>
        <!-- 模块 end -->
      </el-collapse>
    </div>
    </el-row>
    <!--  <div class="source">
      <div>
        <ul class="el-upload-list el-upload-list--picture-card">
          <li
            class="el-upload-list__item"
            v-for="(item, index) in thepicture"
            :key="index"
          >
            <img
              :src="
                baseURL +
                  '/api-check/followYzyFileStorages/followYzyFileStorage/img?fileId=' +
                  item.fileId
              "
              alt=""
              class="el-upload-list__item-thumbnail"
            />
            <span class="el-upload-list__item-actions">
              <span
                class="el-upload-list__item-preview"
                @click="
                  module_preview(
                    baseURL +
                      '/api-check/followYzyFileStorages/followYzyFileStorage/img?fileId=' +
                      item.fileId
                  )
                "
              >
                <i class="el-icon-zoom-in"></i>
              </span>
            </span>
          </li>
        </ul>
      </div>
    </div>-->
    <!-- 弹窗 医院信息 预览窗口 start -->
    <el-dialog :visible.sync="dialogPreviewHostipalImageVisible">
      <img width="100%" :src="dialogPreviewHostipalImageUrl" alt="" />
    </el-dialog>
    <!-- 弹窗 医院信息 预览窗口 end-->
  </div>
</template>

<script>
import elementResizeDetectorMaker from "element-resize-detector";
import testing_planning from "@/views/follow-up/testing-planning";
import {
  queryItems,
  getItemRanges,
  getItemRangesNew,
  getData,
  baseURL
} from "@/api/follow-up/testing-insights";
import { showthepicture } from "@/api/follow-up/testing-insights";
import { displayphotos } from "@/api/follow-up/testing-insights";
export default {
  props: ["patId",'state'],
  data() {
    return {
      baseURL: baseURL,
      type: "1",
      pickerOptions: {
        shortcuts: [
          {
            text: "最近一周",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit("pick", [start, end]);
            }
          },
          {
            text: "最近一个月",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
              picker.$emit("pick", [start, end]);
            }
          },
          {
            text: "最近三个月",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
              picker.$emit("pick", [start, end]);
            }
          },
          {
            text: "最近六个月",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 180);
              picker.$emit("pick", [start, end]);
            }
          },
          {
            text: "最近一年",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 360);
              picker.$emit("pick", [start, end]);
            }
          }
        ]
      },
      time: [],
      dataRange: [],
      test_item_option_value: "血压/BP", //当前选择检测项
      test_item_frequency_value: "收缩压", //当前选择频次
      bloodPressure: [], //血压/BP
      bloodSugar: [], //血糖/Glu
      bloodFat: [], //血脂/TC
      bloodUrine: [], //血尿/UA
      electrocardio: [], //心电/ECG
      bloodOxygen: [], //血氧
      glycosylatedHb: [], //糖化血红蛋白
      homocySteine: [], //同型半胱氨酸
      thepicture: [], //图片集合
      dialogPreviewHostipalImageUrl: "", //就诊 预览图片窗口
      dialogPreviewHostipalImageVisible: false,
      current_insight: {
        date: [],
        data: []
      }, //当前echart数据
      downValue: "",
      upValue: "",
      items: [], //检测项集合
      frequencies: [], //检测项对应检测频次集合
      itemRanges: [], //所有值范围集合
      itemRange: "", //当前值范围文字说明
      ref_ids: [], //关联id集合
      hospitals: [], //就诊医院列表
      first_code: "", //查看检测项code
      patientId: this.patId || this.$route.query.patId
    };
  },
  methods: {
    test() {

    },
    /**查看检测项 中英文对应关系 */
    getMap() {
      const items = {
        "血压/BP": "bloodPressure",
        收缩压: "systolic",
        舒张压: "diastolic",

        "血糖/Glu": "bloodSugar",
        空腹: 0,
        早餐后: 1,
        午餐前: 2,
        午餐后: 3,
        晚餐前: 4,
        晚餐后: 5,
        睡前: 6,

        "血脂/TC": "bloodFat",
        总胆固醇: "totalCholesterol",
        甘油三酯: "triglyceride",
        高密度脂蛋白: "hdl",
        低密度脂蛋白: "ldl",

        "血尿/UA": "bloodUrine",
        "心电/ECG": "electrocardio",
        血氧: "bloodOxygen",
        糖化血红蛋白: "glycosylatedHb",
        同型半胱氨酸: "homocySteine"
      };

      return items;
    },
    /**
     * 格式化日期 yyyy-mm-dd
     */
    getFormatDate(item) {
      let year = item.getFullYear();
      let month = item.getMonth() + 1;
      let day = item.getDate();
      if (month < 10) {
        month = "0" + month;
      }
      if (day < 10) {
        day = "0" + day;
      }

      return year + "-" + month + "-" + day;
    },
    async insight_render(item) {
      let that = this;
      let items = this.getMap();
      let a = items[item];
      let frequency_en = items[this.test_item_frequency_value]; //频次对应非汉字
      let r = [];
      this.current_insight.date = []; //清空

      await this.getData(item);

      if (item == "血压/BP") {
        this[a].forEach((item, index) => {
          r.push(item[frequency_en]);
        });
        this.$set(this.current_insight, "data", r); //数值

        this[a].forEach(element => {
          this.current_insight.date.push(element.testTime.split(" ")[0]); //日期
        });
      }

      if (item == "血糖/Glu") {
        let _r = this[a].filter((item, index) => {
          return item.choose == frequency_en;
        });

        _r.forEach((element, index) => {
          r.push(element.sugarValue);
          this.current_insight.date.push(element.testTime.split(" ")[0]); //日期
        });

        this.$set(this.current_insight, "data", r); //数值
      }

      if (item == "血脂/TC") {
        this[a].forEach((element, index) => {
          r.push(element[frequency_en]);
          this.current_insight.date.push(element.testTime.split(" ")[0]); //日期
        });

        this.$set(this.current_insight, "data", r); //数值
      }

      if (item == "血尿/UA") {
        this[a].forEach((element, index) => {
          r.push(element.bloodUricAcid);
          this.current_insight.date.push(element.testTime.split(" ")[0]); //日期
        });
        this.$set(this.current_insight, "data", r); //数值
      }

      if (item == "心电/ECG") {
        this[a].forEach((element, index) => {
          r.push(element.heartRate);
          this.current_insight.date.push(element.testTime.split(" ")[0]); //日期
        });
        this.$set(this.current_insight, "data", r); //数值
      }

      if (item == "血氧") {
        this[a].forEach((element, index) => {
          r.push(element.oxygen);
          this.current_insight.date.push(element.testTime.split(" ")[0]); //日期
        });
        this.$set(this.current_insight, "data", r); //数值
      }

      if (item == "糖化血红蛋白") {
        this[a].forEach((element, index) => {
          r.push(element.ghbValue);
          this.current_insight.date.push(element.testTime.split(" ")[0]); //日期
        });
        this.$set(this.current_insight, "data", r); //数值
      }

      let echart = this.$echarts.init(document.getElementById("trendline"));
      let echartOption = {
        xAxis: {
          data: that.current_insight.date, //日期
          type: "category"
        },
        yAxis: {
          type: "value"
        },
        series: [
          {
            data: that.current_insight.data, //数据
            type: "line",
            markLine: {
              symbol: ["none", "none"],
              lineStyle:{
                color:'#ff0000'
              },
              label: { show: true,color:'#ff0000' },
              data: [{ yAxis: that.downValue }, { yAxis: that.upValue }] //范围
            },
            label: {
                normal: {
                    show: true,
                    position: 'top'
                }
            },
            lineStyle:{
              color:'#13C2C2'
            },
            itemStyle:{
                  normal : {
                      color:'#13C2C2'
                  }
              }
          }
        ]
      };
      echart.setOption(echartOption);

      return echart;
    },
    insight_resize() {
      this.insight_render(this.test_item_option_value).then(res => {
        let that = this;
        let erd = elementResizeDetectorMaker();
        let trendline = res;
        trendline.resize();
        window.onresize = trendline.resize;
        erd.listenTo(document.getElementById("trendline"), element => {
          that.$nextTick(() => {
            trendline.resize();
          });
        });
      });
    },
    /**
     * 获取值范围集合
     */
    async getItemRanges() {
      let b = {
        inpatientId: this.patientId
      };

      // await getItemRanges(b).then(res => {
      //   let result = res.data;
      //   this.itemRanges = result;
      // });

      await getItemRangesNew().then(res => {
        let result = res.data;
        this.itemRanges = result;
      });

      this.getRefIds(); //获取关联id集合
    },
    /**
     * 获取关联id集合
     */
    async getRefIds() {
      let b = {
        rangeCode: "test_item_ref_id"
      };

      await queryItems(b).then(res => {
        let result = res.data;
        this.ref_ids = result;
      });

      this.getFrequencies(this.test_item_option_value);
    },
    /**
     * 获取检测项集合
     */
    async getItems() {
      let b = {
        rangeCode: "test_item"
      };

      await queryItems(b).then(res => {
        let result = res.data;
        this.items = result;
      });

      this.getItemRanges(); //获取 值范围集合

      return "";
    },
    /**
     * 检测频次 部分获取值范围
     */
    getFrequencies(name) {
      let obj = this.items.filter((item, index) => {
        return item.name === name;
      })[0];

      let a = this.getMap();

      this[a[name]] = [];

      this.first_code = obj.code;
      this.frequencies = obj.comCodeLists;
      this.test_item_frequency_value = obj.comCodeLists[0]?.name;

      if (!obj.comCodeLists[0]?.name) {
        let _obj = this.ref_ids.filter((item, index) => {
          return item.code == obj.code;
        })[0];

        let target = this.itemRanges.filter((item, index) => {
          return item.refId == _obj.name;
        });



        this.downValue = target[0].down;
        this.upValue = target[0].up;
        //this.itemRangeArr = [target[0].down,target[0].up];
        this.itemRange =
          '正常检测范围值：<span id="range_min">' +
          target[0].down +
          '</span>~<span id="range_max">' +
          target[0].up +
          "</span>" +
          target[0].unitRemark;
      } else {
        this.itemRange = "";
        let name = obj.comCodeLists[0].name;

        let _obj = this.ref_ids.filter((item, index) => {
          return item.code == obj.code;
        })[0];

        let target = this.itemRanges.filter((item, index) => {
          return item.refId == _obj.comCodeLists[0].name;
        });
        this.downValue = target[0].down;
        this.upValue = target[0].up;
        //this.$set(this.current_insight,'range',[target[0].down,target[0].up]);
        this.itemRange =
          '正常检测范围值：<span id="range_min">' +
          target[0].down +
          '</span>~<span id="range_max">' +
          target[0].up +
          "</span>" +
          target[0].unitRemark;
      }
    },
    /**
     * 获取值范围
     */
    getItemRange(name) {
      let first_code = this.first_code;
      let items = this.items;
      let comCodeLists = items[first_code].comCodeLists;
      let obj = comCodeLists.filter((item, index) => {
        return item.name == name;
      })[0];
      let code = obj.code;

      let ref_id = this.ref_ids[first_code].comCodeLists.filter(
        (item, index) => {
          return item.code == code;
        }
      )[0].name;

      let target = this.itemRanges.filter((item, index) => {
        return item.refId == ref_id;
      });

      this.downValue = target[0].down;
      this.upValue = target[0].up;
      this.itemRange =
        "正常检测范围值：" +
        target[0].down +
        "~" +
        target[0].up +
        target[0].unitRemark;
      //this.getFrequencies(this.test_item_option_value); //获取 检测频次
    },
    /**
     * 获取数据
     */
    async getData(item) {
      let end = new Date();
      let start = new Date();
      start.setTime(start - 3600 * 1000 * 24 * 30 * 12); //一年
      let endDatetime = this.getFormatDate(end);
      let startDatetime = this.getFormatDate(start);
      this.dataRange =
        this.dataRange.length == 0
          ? [startDatetime, endDatetime]
          : this.dataRange;

      let items = this.getMap();

      let a = items[item];
      this.test_item_option_value = item;

      let b = {
        cloudMemberId: this.patientId,
        startDatetime: this.dataRange[0],
        endDatetime: this.dataRange[1],
        orderField: "testTime",
        orderType: "asc"
      };

      let c = await getData(a, b).then(res => {
        let result = res.data;
        this[a] = result;
        return result;
      });

      return c;
    },
    /**
     * 表格数据渲染
     */
    table_render(item = "血压/BP") {
      this.getData(item);
    },
    /**
     * 查询
     */
    query() {
      let type = this.type;

      if (type == 1) {
        this.insight_render(this.test_item_option_value); //数据图表
      }

      if (type == 2) {
        this.table_render(this.test_item_option_value); //数据表格
      }
    },
    needLoad() {
      this.getItems().then(res => {
        this.table_render(this.test_item_option_value);
        this.insight_render(this.test_item_option_value).then(res => {
          this.insight_resize();
        });
      }); //获取检测项集合
    },
   thequeryimage() {
      let params = {
        patientId: this.patientId
        // patientId: "666"
      };
      showthepicture(params).then(res => {
        if (res.status == 0) {
          this.$message({
            message: "未获取到心电图",
            type: "warning"
          });
        } else if (res.status == 1) {
          this.$message({
            message: "提取成功",
            type: "success"
          });
          this.accordingto();
        }
      });
    },
    accordingto() {
      let params = {
        patientId: this.patientId
        // patientId: "666"
      };
      displayphotos(params).then(res => {
        this.hospitals = res.checkups; //时间显示
      });
    },
    module_preview(img) {
      this.dialogPreviewHostipalImageUrl = img;
      this.dialogPreviewHostipalImageVisible = true;
    }
  },
  components: {
    "testing-planning": testing_planning
  },
  mounted() {
    this.needLoad();
    this.accordingto();
  }
};
</script>

<style lang="scss" scoped>
.head {
  display: flex;
  justify-content: space-between;
  align-items: center;

  .annotation {
    color: #909399;
    font-size: 14px;
  }
}
h3 {
  color: #4380ea;
}
h5 {
  @extend h3;
}
.row-spacing {
  margin-bottom: 15px;
}
.frequency {
  margin-left:10px;
  margin-right:10px;
  display: inline-block;
}
.red {
  color: red;
}
.query {
  margin-left: 100px;
}
.adjustment {
  display: flex;
  justify-content: space-between;

  & > div {
    flex: 1 1 auto;

    &:last-child {
      text-align: right;
    }
  }
}
</style>